// pages/invitation/invitation.js
const app = getApp();
import drawQrcode from '../../utils/weapp.qrcode.min.js'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 组件所需的参数
    navbarData: {
      showCapsule: 1, //是否显示左上角图标   1表示显示    0表示不显示
      title: '我的邀请码', //导航栏 中间的标题
      out: 1,
    },
    // 此页面 页面内容距最顶部的距离
    height: app.globalData.height,
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var _this = this;
    //二维码
    wx.showLoading({
      title: '加载中...',
      mask: true
    })
    var _this = this;
    var qrcode_width = 170; //二维码大小
    var qrcode_background = "#FFFFFF"; //二维码背景颜色，默认值白色。颜色太深容易扫不出来，不兼容。颜色越淡越好。
    var qrcode_foreground = "#000000"; //二维码前景色，默认值黑色
    var qrcode_url = 'https://zyq.tjhaiqing.com/fx/?user_name=' + wx.getStorageSync('user_name')
    //  var qrcode_url = 'https://jiujinimg.tjnanguyi.com/live/'
    //生成二维码
    drawQrcode({
      width: qrcode_width,
      height: qrcode_width,
      x: 20,
      y: 20,
      canvasId: 'logoQRCode',
      text: qrcode_url,
      background: qrcode_background, //二维码背景颜色，默认值白色
      foreground: qrcode_foreground, //二维码前景色，默认值黑色
      correctLevel: 2, //非必须，二维码纠错级别，默认值为高级，取值：{ L: 1, M: 0, Q: 3, H: 2 }
      callback(e) {
        console.log('e: ', e)
      }
    })
    wx.downloadFile({
      url: 'https://jiujinimg.tjnanguyi.com/image/WeChatImg/yongquanlijian.png',
      success(res) {
        console.log(res)
        //加logo
        _this.drawImg(res.tempFilePath, qrcode_width + 75, 'logoQRCode', qrcode_background, qrcode_foreground); //打上LOGO
      }
    })
    // 获取手机号
    // var phone = wx.getStorageSync('mobile')
    // var mobile = phone.substring(0, 3) + '****' + phone.substring(7);
    var user_name = wx.getStorageSync('user_name')
    _this.setData({
      user_name: user_name
    })
    //将加完logo的二维码生成图片
    var qrCode = setInterval(function () {
      if (_this.data.logoState) {
        clearInterval(qrCode)
        //生成图片
        wx.canvasToTempFilePath({
          width: 250,
          height: 250,
          destWidth: 250,
          destHeight: 250,
          canvasId: 'logoQRCode',
          success: function (res) {
            var tempFilePath = res.tempFilePath;
            console.log(tempFilePath,6)
            _this.setData({
              qrCodeImg: tempFilePath,
              qrCodeState: true
            }) 
          },
          fail: function (res) {
            console.log(res);
          }
        });
      }
    }, 300)

    //生成海报
    var poster = setInterval(function () {
      if (_this.data.qrCodeState) {
        clearInterval(poster)
        _this.onCanvas(_this.data.qrCodeImg, _this.data.nickname)
      }
    }, 300)




  },
  //查看图片
  onUrl() {
    wx.previewImage({
      urls: [this.data.tempFilePath],
      current: this.data.tempFilePath
    })
  },
  //生成海报
  onCanvas(ercode, yh) {
    var _this = this;
    var text = '优惠码 ' + _this.data.user_name
    var ctx = wx.createCanvasContext('firstCanvas')
    wx.downloadFile({
      url: 'https://jiujinimg.tjnanguyi.com/zhenyuanqi/yq_bg.png',
      success(res) {
        console.log(ercode)
        ctx.drawImage(res.tempFilePath, 0, 0, 686, 842)
        ctx.draw(true)
        ctx.drawImage(ercode, 200, 155, 420, 420)
        ctx.setFontSize(36)
        ctx.fillStyle = '#000';
        ctx.fillText(text, 40,80)
        ctx.draw(true)

        setTimeout(function () {
          //生成图片
          wx.canvasToTempFilePath({
            width: 686,
            height: 842,
            destWidth: 686,
            destHeight: 842,
            canvasId: 'firstCanvas',
            success: function (res) {
              var tempFilePath = res.tempFilePath;
              wx.hideLoading();
              _this.setData({
                tempFilePath: tempFilePath,
              })
            },
            fail: function (res) {
              console.log(res);
            }
          });
        }, 300)
      }
    })






  },
  //加logo
  drawImg(src, width, canvas, qrcode_background, qrcode_foreground) {
    var imgSize = Math.round(width / 8);
    var imgPos = Math.round(width / 9 * 4) - 38;
    var imgPosFix = Math.round(width / 120);
    const ctx2 = wx.createCanvasContext(canvas);
    //ctx2.strokeStyle = '#fff';
    //ctx2.lineWidth = 4;
    //ctx.globalAlpha = 0.8;
    // ctx2.globalAlpha = 1; //透明度
    //ctx2.lineCap = "round";
    //ctx2.lineJoin = "round";
    // ctx2.beginPath();
    // ctx2.setStrokeStyle(qrcode_background); //'#fff'
    // ctx2.setLineWidth(4);
    // ctx2.setLineCap('round');
    // ctx2.setLineJoin('round');
    // ctx2.moveTo(imgPos - imgPosFix, imgPos - imgPosFix);
    // //ctx2.moveTo(imgPos, imgPos);    
    // ctx2.lineTo(imgPos + imgSize + imgPosFix, imgPos - imgPosFix); //上边
    // ctx2.lineTo(imgPos + imgSize + imgPosFix, imgPos + imgSize + imgPosFix); //右边
    // ctx2.lineTo(imgPos - imgPosFix, imgPos + imgSize + imgPosFix); //下边
    // ctx2.lineTo(imgPos - imgPosFix, imgPos - imgPosFix); //左边    
    // ctx2.stroke();
    // ctx2.closePath();

    // ctx2.beginPath();
    // ctx2.setStrokeStyle(qrcode_foreground); //'#000'
    // ctx2.setLineWidth(1);
    // ctx2.setLineCap('round');
    // ctx2.setLineJoin('round');
    // ctx2.moveTo(imgPos - imgPosFix, imgPos - imgPosFix);
    // //ctx2.moveTo(imgPos, imgPos);    
    // // ctx2.lineTo(imgPos + imgSize + imgPosFix, imgPos - imgPosFix);//上边
    // // ctx2.lineTo(imgPos + imgSize + imgPosFix, imgPos + imgSize + imgPosFix);//右边
    // // ctx2.lineTo(imgPos - imgPosFix, imgPos + imgSize + imgPosFix);//下边
    // // ctx2.lineTo(imgPos - imgPosFix, imgPos - imgPosFix);//左边    
    // ctx2.stroke();
    // ctx2.closePath();

    // ctx2.drawImage(src, imgPos - 1, imgPos - 1, imgSize + 2, imgSize + 2);
    //ctx2.beginPath();
    ctx2.draw(true);
    this.setData({
      logoState: true
    })
  },

})